<extend name='Public/index'/>
<block name='content'>
<form action="?" method='get'>
    <fieldset>
        
            <volist name='vvvo' id='list'>
            <input type="checkbox" name='field' value="<{$list.field}>"><{$list.field}>
            </volist>
            <input type="submit" value='搜索'>
    </fieldset>
</form>
<div id='S'>
		<input id='search' type="text" placeholder="请输入关键字完成搜索">
		<div id="livesearch"></div>
	</div>
<table id='Tbl'>
<thead>
	<tr>
		<th><input type="checkbox" onclick="selectAll(this)" value='全选'></th>
		<th>编号</th>
		<th>关键字</th>
		<th>值</th>
		<th>描述</th>
		<th>锁定</th>
		<th>操作</th>
	</tr>
	</thead>
	<tbody>
	<volist name='dict' id='vo'>
		<tr id="row_<{$vo.dict_id}>">
			<td><input type="checkbox" class='select' value='<{$vo.dict_id}>' ></td>
			<td><{$vo.dict_id}></td>
			<td><input name="field" class="clss" disabled type="text" value="<{$vo.field}>"></td>
			<td><input name="val" class="clss" disabled type="text" value="<{$vo.val}>"></td>
			<td><input name="desc" class="clss" disabled style="width:4em;" type="text" value="<{$vo.desc}>"></td>
                
			<td>
			
             <div class="switch tiny">
              <input onclick="lock(this)" value="<{$vo.dict_id}>" id="lock_<{$vo.dict_id}>" type="checkbox"  <{$vo['lock']?'checked':''}>>
                <label for="lock_<{$vo.dict_id}>"></label>
                </div>   
			</td>  
			<td>
			<button type="button" onclick='edit("<{$vo.dict_id}>")' class='edit tiny'>编辑</button>
			<button style='display:none' onclick='save("<{$vo.dict_id}>")' type="button" class="save">保存</button>
			</td>
		</tr>
	</volist>
	</tbody>
</table>
<{$page}>
<input type="button" class="button tiny" onclick="moreDel()" value='删除(批量)'>
<input type="button" class="button tiny" onclick="unSelect()" value='反选'>
<input type="button" class="button tiny" onclick="add()" value='添加'>
<input type="button" class="button tiny" onclick="cancel()" value='取消'>
<script>
        function selectAll(obj) {
            $('#Tbl tbody .select').prop('checked',$(obj).prop('checked'));
        }
        function unSelect() {
            $('#Tbl tbody .select').map(function(){
                $(this).prop('checked',!$(this).prop('checked'));
            });
        }
        function moreDel() {
            if(!confirm('确定删除吗?')){
                return;
            }
            var ids = $('#Tbl tbody .select:checked').map(function () {
                $(this).parent().parent().remove();
                return $(this).val();
            });
            ids  = ids.get().join();
            $.post('<{:U("doDelDict")}>',{ids:ids},function (data) {
                if(data.error ==0)alert(data.msg);
            });
        }
        function lock(obj) {
            var id = $(obj).val();
            var lockval = $(obj).prop('checked')?1:0;
            $.post('<{:U("doEditDict")}>',{dict_id:id,lock:lockval});
        }

        
        
        function edit(id) {
            $('#row_'+id+' .clss').prop('disabled',false);
            $('#row_'+id+' .edit').hide();
            $('#row_'+id+' .save').show();
        }

        function save(id) {
            $('#row_'+id+' .clss').prop('disabled',true);
            $('#row_'+id+' .edit').show();
            $('#row_'+id+' .save').hide();

            var data = {
                dict_id:id,
                field:$('#row_'+id+' [name=field]').val(),
                val:  $('#row_'+id+' [name=val]').val(),
                desc :  $('#row_'+id+' [name=desc]').val(),
            }

            $.post('<{:U("doEditDict")}>',data,function (data) {
                if(data.error==0){
                    alert(data.msg);
                }
            });

        }
        function add(){
            $.get("<{:U('lastId')}>", '',
            function(id){
               var id= parseInt(id)+1;

                var html ="     <tr id=\'row_"+id+"\'>"+
    "           <td><input type=\'checkbox\' class=\'select\' value=\'\' ></td>"+
    "           <td>"+id+"</td>"+
    "           <td><input name=\'field\' class=\'clss\' disabled type=\'text\' value=\'\'></td>"+
    "           <td><input name=\'val\' class=\'clss\' disabled type=\'text\' value=\'\'></td>"+
    "           <td><input name=\'desc\' class=\'clss\' disabled style=\'width:4em;\' type=\'text\' value=\'\'></td>"+
    "                "+
    "           <td>"+
    "           "+
    "             <div class=\'switch tiny\'>"+
    "              <input onclick=\'lock(this)\' value=\'>\' id=\'lock_>\' type=\'checkbox\'  <{$vo[\'lock\']?\'checked\':\'\'}>>"+
    "                <label for=\'lock_"+id+"\'></label>"+
    "                </div>   "+
    "           </td>  "+
    "           <td>"+
    "           <button type=\'button\' onclick=\'edit("+id+")\' class=\'edit\'>编辑</button>"+
    "           <button style=\'display:none\' onclick=\'save("+id+")\' type=\'button\' class=\'save\'>保存</button>"+
    "           </td>"+
    "       </tr>";

            $('tbody').append(html);
            
            });
        }
		
		$('#search').keyup(function(event){
			var val,
				href,
			val = $(this).val();
			if(val == ''){
				$('#livesearch').html(null);
				return;
			}
			switch(event.keyCode){
				case 13:		
					if($('#livesearch a[id="uc"]')){
						href = $('#livesearch a[id="uc"]').prop('href');
					}else{
						href = $('#livesearch a:first').prop('href');				
					}		
					window.location.href = href;
					break;
				case 40:
					if(val != null)
					down();
					return;
			}


			$.get("<{:U('search')}>",{keyword:val},function(data){
				var html;
				$('#livesearch').html(null);
				for(index in data){
					html = '<a href="/index.php/Sys/Dict/dict?field='+data[index]+'">'+data[index]+'</a>';
					$('#livesearch').append(html);
				}
			});
		});

		var down = function(){
			var maxNum,
				n;
			if(!$('#livesearch').html())return;
			maxNum = $('#livesearch a').size()-1;
			$('#livesearch').find('a').eq(num).css('background-color','#D1D1D1').attr('id','uc');
			if(num != 0){
				n = num;
				n -=1;
				$('#livesearch').find('a').eq(n).css('background-color','').attr('id','');
			}
			if(num < maxNum){
				num +=1;
			}
		}

        


</script>
</block>